<template>
  <TresCanvas shadows >
    <!-- 这里是您的场景 -->
   
    <sence></sence>
    <!-- 加载地板 -->
    <!-- <Ground></Ground> -->
     <!-- 加载月亮  -->
    <Moon></Moon>
    <!-- 加载地球 -->
    <earth></earth>
    <!-- 加载hdr背景 -->

    <!-- <Suspense>
      <template #fallback>
        <Teleport to="body">
          <div>1111111111</div>
        </Teleport>
      </template>
      <BackGround></BackGround>
    </Suspense> -->
    <!-- <TresDirectionalLight
      :color="new THREE.Color(0xffffff)"
      :intensity="1.2"
      :position="[0, 5, 4]"
    /> -->
    <!-- 加载模型 -->
    <Suspense>
      <car></car>
    </Suspense>
  </TresCanvas>
</template>

<script setup lang="ts">
import { TresCanvas } from "@tresjs/core";
import { OrbitControls } from "@tresjs/cientos";
import sence from "./sence.vue";
import Ground from "./Ground.vue";
import Moon from "./Moon.vue";
import earth from "./earth.vue";
import { RGBELoader } from "three/examples/jsm/loaders/RGBELoader.js";
import BackGround from "./BackGround.vue";
import * as THREE from "three";
import car from './car.vue'
</script>

<style scoped></style>
